<template>
  <div>
    <div class="time">
      <h2 v-if="titleName">{{titleName}}</h2>
      <h2 v-else>{{realTime}}</h2>
    </div>
  </div>
</template>
<script>
export default {
    props:{
           titleName:{
              type:String
           }   
    },
    data(){
        return{
          timer:"",
          realTime:''
        }
    },
    methods:{
        dealWithTime(data) {
          var date_start = new Date();
          this.realTime =
            date_start.Format("yyyy-MM-dd hh:mm:ss") +
            " " +
            "星期" +
            "日一二三四五六".charAt(new Date().getDay());
        },
    },
    created() {
      if(!this.titleName){
          this.timer = setInterval(() => {
          this.dealWithTime();
        }, 1000);
      }
    },
  destroyed(){
      if (this.timer) {
       clearInterval(this.timer);
     }
  }
};
</script>
<style scoped>
    .time {
        background: url("../../assets/image/page/RunningTime.png") no-repeat;
        width: 440px;
        height: 58px;
        line-height: 58px;
        color: #ffffff;
        text-align: center;
        font-size: 18px;
    }
</style>